<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>购物简易计算器</title>
</head>
<body>
<table>
    <tr>
        <td><img src="gwc.jpg" width="40px" /></td>
        <td colSpan="3">购物简易计算器</td>
    </tr>
    <tr>
        <td>第一个数:</td>
        <td colspan="3"><input type="number" class="input-number" id="num1" /></td>
    </tr>
    <tr>
        <td>第二个数:</td>
        <td colspan="3"><input type="number" class="input-number" id="num2" /></td>
    </tr>
    <tr>
        <td>
            <button onclick="calculate('+')" class="calculator-button">+</button>
        </td>
        <td>
            <button onclick="calculate('-')" class="calculator-button">-</button>
        </td>
        <td>
            <button onclick="calculate('*')" class="calculator-button">*</button>
        </td>
        <td>
            <button onclick="calculate('/')" class="calculator-button">/</button>
        </td>
    </tr>
    <tr>

        <td>计算结果</td>
        <td colspan="3"><input type="text" id="result" readonly></td>
    </tr>
</table>

<script>
    function calculate(operation) {
        var num1 = parseInt(document.getElementById('num1').value);
        var num2 = parseInt(document.getElementById('num2').value);
        var result;
        switch(operation) {
            case '+':
                result = num1 + num2;
                break;
            case '-':
                result = num1 - num2;
                break;
            case '*':
                result = num1 * num2;
                break;
            case '/':
                if(num2 !== 0) {
                    result = num1 / num2;
                } else {
                    alert("除数不能为0");
                    return;
                }
                break;
            default:
                result = "无效操作";
        }
        document.getElementById('result').value = result;
    }
</script>
</body>
</html>
